<template>
  <el-form ref="form" :model="form" label-width="120px">
    <el-form-item label="选择添加方式">
      <el-switch
        v-model="dialogFormVisible3"
        inactive-text="通过上传ppt选择"
        active-text="通过机密资料列表选择"
        :disabled="disabledg"
      ></el-switch>
    </el-form-item>
    <el-divider></el-divider>
    <el-form-item label="选择添加方式">
      <el-switch
        v-model="dialogFormVisible2"
        inactive-text="通过上传视频选择"
        active-text="通过视频列表选择"
        :disabled="disabledf"
      ></el-switch>
    </el-form-item>
    <el-collapse-transition>
      <updatevideo
        v-show="!dialogFormVisible2&&!dialogFormVisible3"
        v-bind:updatedvideoId="updatedvideoId"
        v-bind="{disabled:disabled1}"
      ></updatevideo>
    </el-collapse-transition>
    <videolist v-bind="{ updatedvideoId }" v-show="dialogFormVisible2"></videolist>
    <el-select v-model="form.secretfileID" filterable placeholder="请选择" v-show="dialogFormVisible3">
      <el-option v-for="item in Secretfile" :key="item.ID" :label="item.name" :value="item.ID"></el-option>
    </el-select>
    <el-form-item>
      <el-button type="primary" :disabled="disabled" @click="onSubmit">立即创建</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { mapState } from "vuex";
import { asyncuploadLession } from "../../../plugins/api.js";
import updatevideo from "@/components/update.vue";
import videolist from "@/components/admin/videolist.vue";
export default {
  data() {
    return {
      form: {
        name: "",
        num: 1,
        course_ID: "",
        lessionInfo: "",
        videoId: "",
        lengthTime: "",
        type: "",
        secretfileID: ""
      },
      disabled: true,
      disabledf: false,
      disabledg: false,
      tableData: [],
      dialogFormVisible2: false,
      dialogFormVisible3: false,
      options: [],
      optioncascader: []
    };
  },
  computed: mapState(["Tpdata", "Secretfile"]),
  mounted() {
    if (this.course) {
      this.form.course_ID = this.course.Course.ID;
      this.form.num = this.course.Lession.length + 1;
    }
  },
  props: ["course", "start", "id", "setdialog"],
  watch: {
    dialogFormVisible2(a) {
      if (a) {
        this.disabledg = true;
      } else {
        this.disabledg = false;
      }
    },
    dialogFormVisible3(b) {
      if (b) {
        this.disabledf = true;
      } else {
        this.disabledf = false;
      }
    },
    "form.videoId"(v) {
      if (v) {
        this.disabled = false;
      } else {
        this.disabled = true;
      }
    },
    "form.secretfileID"(p) {
      if (p) {
        this.disabled = false;
      } else {
        this.disabled = true;
      }
    }
  },
  methods: {
    handleChange(v) {
      console.log(123);
      const tablename = v[0];
      const tableid = v[1];
      this.tpdata.tablename = tablename;
      this.tpdata.tableid = tableid;
      if (tablename == "Secretfile") {
        this.tpdata.isdown = false;
      }
      for (let v of this[tablename]) {
        if (v.ID == tableid) {
          let fileurl = this.fileurl[tablename].url;
          this.tpdata.fileurl = v[fileurl];
          let name = this.fileurl[tablename].name;
          this.tpdata.name = v[name];
        }
      }
    },
    async onSubmit() {
      if (this.dialogFormVisible2 == true) {
        (this.form.secretfileID = " "), (this.form.type = "video");
      }
      if (this.dialogFormVisible3 == true) {
        this.form.videoId = " ";
        this.form.type = "vector";
        this.form.name = this.Secretfile.find(
          v => v.ID == this.form.secretfileID
        ).name;
      }
      if (this.form.num >= 2) {
        return this.$message({
          message: "只能添加一小节，谢谢！",
          type: "success"
        });
      }
      try {
        await asyncuploadLession(this.form);
        this.start(this.id);
        this.$message({
          message: "恭喜你，添加成功",
          type: "success"
        });
        this.setdialog();
      } catch (err) {
        this.$message.error("错了哦，添加失败:" + err);
      }
    },
    updatedvideoId(data, name) {
      this.form.videoId = data;
      this.form.name = name;
    },
    updatedvideoId1(data) {
      this.form.videoId = data;
    },
    disabled1() {
      this.disabled = !this.disabled;
    }
  },
  components: {
    updatevideo,
    videolist
  }
};
</script>

<style scoped>
</style>